<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%
String basePath = request.getContextPath();
%>
<title>一起玩</title>
<script type="text/javascript" src="<%=basePath %>/resource/js/ajax_constants.js"></script>
<script type="text/javascript" src="<%=request.getContextPath() %>/resource/js/jquery/jquery-1.8.2.js"></script>
<script type="text/javascript" src="<%=request.getContextPath() %>/resource/js/jquery/jquery.cookie.js"></script>
<script type="text/javascript" src="<%=basePath %>/resource/js/honeycombtool.js"></script>
<script type="text/javascript">
function chang_iframe(){
	if($("#activity").css("display") == "block"){
		$("#activity").css("display","none");
		$("#posts").css("display","block");
		$("#navigation").css("display","block");
		$("#changeActivity").html("正在进行");
	}
	else{
		$("#activity").css("display","block");
		$("#posts").css("display","none");
		$("#navigation").css("display","none");
		$("#changeActivity").html("看看别的");
	}
}
function doOver(){
	 $("#changeActivity").removeClass("onActivity");
	 $("#changeActivity").addClass("offActivity");
}
function doOut(){
	 $("#changeActivity").removeClass("offActivity");
	 $("#changeActivity").addClass("onActivity");
}
function firstClickBaChangIframe(){
	$("#activity").css("display","block");
	$("#posts").css("display","none");
	$("#navigation").css("display","none");
}
var jucanActivity = 1;
var sportsActivity = 0;
var pkcaiActivity = 0;
var tucaoActivity = 0;
var str = [jucanActivity,sportsActivity,pkcaiActivity,tucaoActivity];
function menuItemClick(menuKey,index) {
	var basePath = '<%=basePath%>';
	var url = $("#posts>iframe").attr("src");
	var urlActivity = $("#activity").attr("src");
	if (menuKey == "jucanImg") {
		url = "<%=basePath%>/play/dine";
	}
	if (menuKey == "yundongImg") {
		<%-- url = "<%=basePath%>/play/sportsBa";
		if(str[index] == 0){
			urlActivity = "<%=basePath%>/play/sportsActivity";
		} --%>
	}
	if (menuKey == "pkcaiImg") {
		
	}
	if (menuKey == "tucaoImg") {
		
	}
	if ($("#posts>iframe").attr("src") != url) {
		reLoadPostsIframe(url);
	}
	if($("#activity").attr("src") != urlActivity ){
		reLoadActivityIframe(urlActivity);
		str[index] = 1;
	}
	
}
function reLoadPostsIframe(url) {
	$("#posts>iframe").attr("src", url);
	$("#posts").css("display","block");
}
function reLoadActivityIframe(url) {
	$("#activity").attr("src", url);
	firstClickBaChangIframe();
}
var timer = null;
$(function(){
	$("#login_button_parent").click(doLogin);
	var $img = $("#navigation img");
	var PLAY_NAVIGATION_SELECTED = 0;
	$img.each(function(index){

			$(this).click(function(){
				if(PLAY_NAVIGATION_SELECTED != index){
					$img.eq(index).animate({"width":"160px", "height":"160px"},300);
					$img.eq(PLAY_NAVIGATION_SELECTED).animate({"width":"100px", "height":"100px"},300);
					menuItemClick(this.id, index);
					PLAY_NAVIGATION_SELECTED = index;
				}
			});
			
			$(this).mouseover(function(){
					if(PLAY_NAVIGATION_SELECTED != index){ 
						 timer=setTimeout(function(){
								$img.eq(index).animate({width:160+"px", height:160+"px"},300);
							},200);
					}
				
			});
			
			$(this).mouseout(function(){
				clearTimeout(timer);
				if(PLAY_NAVIGATION_SELECTED != index){
					
					$img.eq(index).animate({"width":"100px", "height":"100px"},300);
				}
			});
		
		});
	$("#changeActivity").bind({
		"click" : chang_iframe,
		"mouseover" : doOver,
		"mouseout" : doOut
	});
});
function openChatLogin(message){
	$("#loginStorey").css({"display": "block"});
	if (message && "" != message) {
		$("#login_before_error_message").html(message);
	}
}

function doLogin() {
	$(".box").html("");
	var userLoginName = $("#userLoginName").val();
	var userLoginPassword = $("#userLoginPassword").val();
	if (CHECK.isEmail(userLoginName) && CHECK.isPassword(userLoginPassword)){
		chang_condition();
		$("#login_button_parent").unbind("click");
		$.ajax({
			type: 'post',
			url: '../user/ajaxLogin',
			data: {
				"email" : userLoginName,
				"password" : userLoginPassword
			},
			dataType: 'json',
			success: function(reultMap){
				if(reultMap.result == 0){
					// 让信息加载到聊天中
					loadChatMessage();
					setTimeout(function(){
					closeLoginPage();
					},1000);
					doInsertCookie(userLoginName,userLoginPassword,reultMap.loginMessage.nickName);
					var date = new Date();
					// 设置过期时间为半个小时
					date.setTime(date.getTime() + 30 * 60 * 1000);
					$.cookie("userHadLogin", true, {path: "/",expires: date});
					
						$(".box").html("登陆成功");
					
				} else {
					original_condition();
					$("#login_button_parent").click(doLogin);
					$(".box").html("登陆失败");
				}
			}
		});
	} else {
		alert("输入的信息有误");
	}
}
function doInsertCookie(userLoginName,userLoginPassword,userLoginNickName){
	if($.cookie("userLoginName") != null){
		$.cookie("userLoginName",null);
	}
	if ($.cookie("userLoginPassword") != null) {
		$.cookie("userLoginPassword",null);
	}
	if ($.cookie("userLoginNickName") != null) {
		$.cookie("userLoginNickName",null);
	}
	$.cookie("userLoginName",userLoginName,{expires:7});
	$.cookie("userLoginPassword",userLoginPassword,{expires:7});
	$.cookie("userLoginNickName",userLoginNickName,{efffxpires:7});
}
function loadChatMessage() {
	/* document.getElementById("activity").contentWindow.document.getElementById("posts").contentWindow.reloadChat(); */
	/* $(window.parent.document).contents().find("#activity").contents().find("#posts")[0].contentWindow.reloadChat(); */
	$("#activity").contents().find("#posts")[0].contentWindow.reloadChat();
}

function nowNotHaveActivity() {
	$("#activity").css("display", "none");
	$("#posts").css("display", "block");
	$("#navigation").css("display", "block");
	$("#activity").attr("src", "");
	$("#changeActivity").css("display", "none");
}
</script>
<style type="text/css">
.navigation_selected{
	width: 160px;
	height: 160px; 
	cursor: pointer;
	margin-bottom: 20px;	
}
.navigation_not_selected{
	width: 160px;
	height: 100px; 
	cursor: pointer;
	margin-bottom: 20px;
}

.activity{
	width: 1000px;
	height: 1000px;
	margin: 0 auto;
}
.posts{
	float: left;
	width: 736px;
	height: 950px;
}
.onActivity{
 	/* background-color: #c7d473; */
 	background-color: #A0DA58;
	padding:20px 10px;
   	width: 15px;
    height: 80px;
    font-size: 1em;
    color:#ffffff;
    left: 1225px;
    line-height: 20px;
    position: absolute;
    top: 100px;
    cursor: pointer;
    text-align: center;
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px;
    writing-mode: tb-rl;
}
.offActivity{
	/* background-color: #a0c958; */
	background-color: #A0C958;
	padding:20px 10px;
   	width: 15px;
    height: 80px;
    font-size: 1em;
    color:#ffffff;
    left: 1225px;
    line-height: 20px;
    position: absolute;
    top: 100px;
    cursor: pointer;
    text-align: center;
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px;
    writing-mode: tb-rl;
}
.navigation_selected_margin{
	margin-bottom: 20px;
}
</style>
</head>
<body style="background-color: #CCCCCC;">
	<%@ include file="top.jsp"%>
	<div id="changeActivity" class="onActivity" style="position: fixed;">看看别的</div>
	<div style="width: 1100px; min-height: 600px; height: auto!important; height: 600px; margin: 0 auto; background: #ffffff;">
		<iframe id="activity" name="activity" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" style="border-style: none; border: 0; display: block;overflow: hidden;background-color: white;" src="<%=basePath %>/play/dine/dineActivity" class="activity"></iframe>
		<div id="navigation" style="float: left; width: 160px; height: 540px;display: none;margin-left: 110px;margin-right: 20px;text-align: right;"> 
			<div id="jucan" class="navigation_selected_margin" >
				<img id="jucanImg" style="width: 160px;height: 160px; " src="<%=basePath %>/resource/images/play/jucan.png">
			</div>
			<div id="yundong" class="navigation_selected_margin">
				<img  id="yundongImg" style="width: 100px;height: 100px; " src="<%=basePath %>/resource/images/play/yundong.png">
			</div> 
			<div id="pkcai" class="navigation_selected_margin">
				<img id="pkcaiImg" style="width: 100px;height: 100px; " src="<%=basePath %>/resource/images/play/pkcai.png">
			</div>
			<div id="tucao" class="navigation_selected_margin">
				<img id="tucaoImg" style="width: 100px;height: 100px; " src="<%=basePath %>/resource/images/play/tucao.png">
			</div>
		</div>
		<div id="posts" style="float: left; display: none;">
			<iframe frameborder="0" marginwidth="0" marginheight="0" scrolling="no" style="border-style: none; border: 0;overflow: hidden;background-color: white;" src="<%=basePath %>/play/dine" class="posts"></iframe>
		</div>
		<div style="clear: both;"></div>
	</div>
<%@ include file="foot.jsp" %>
</body>
</html>